<template>
  <view class="detail-page">
    <view class="detail-title">{{ newDetail.title }}</view>
    <view class="detail-middle">
      <view class="detail-author">发布人：管理员</view>
      <view class="detail-time">{{ newDetail.atime }}</view>
    </view>
    <view class="new-content">
      <rich-text :nodes="newDetail.content"></rich-text>
    </view>
  </view>
</template>

<script>
import { getNewsDetail } from '@/api/home'
export default {
  data() {
    return {
      param: {
        token: "",
        id: "",
      },
      newDetail: {},
    };
  },
  methods: {
    getNewsDetial() {
      getNewsDetail(this.param)
        .then((res) => {
          this.newDetail = res.data;
          const reg = new RegExp("<img", "gi");
          const reg2 = new RegExp("&lt;", "gi");
          const reg3 = new RegExp("&gt;", "gi");
          const reg4 = new RegExp("&quot;", "gi");
          let content = res.data.content;
          content = content
            .replace(reg2, `<`)
            .replace(reg3, `>`)
            .replace(reg4, `'`)
            .replace(reg, `<img width="100%"`);
          this.newDetail.content = content;
        })
        .catch((err) => {
          console.error(err);
        });
    }
  },
  onLoad(option) {
    console.log(option);
    this.param.id = option.id;
    this.param.token = uni.getStorageSync("token");
    this.getNewsDetial();
  },
};
</script>

<style lang='scss' scoped>
.detail-page {
  padding: 10px;
}

.detail-title {
  font-size: 40rpx;
  margin: 10rpx 0;
  
}

.detail-middle {
  display: flex;
  margin: 10rpx 0;
  .detail-time {
    position: absolute;
    right: 15rpx;
  }
}

</style>
